<template>
  <div>
    <header>
      <section class="logo fl">
        <h1><a href="#"></a></h1>
      </section>

      <nav class="fl">
        <ul>
          <li class="">
            <router-link :to="{ path: '/home' }">首页</router-link>
          </li>

          <li>
            <router-link :to="{ path: '/hot' }">热搜榜单</router-link>
          </li>

          <li><router-link :to="{ path: '/single' }">图片识别</router-link></li>
          <li>
            <router-link :to="{ path: '/multiple' }">批量处理</router-link>
          </li>

          <li>
            <router-link :to="{ path: '/dishistory' }">识别记录</router-link>
          </li>
        </ul>
      </nav>
      <section class="login fr">
        <button class="reg-btn" @click="goUser">个人中心</button>
        <button class="login-btn" @click="logOut">退出系统</button>
      </section>
    </header>

    <router-view></router-view>

    <footer>
      <section class="footer-top">
        <section class="footer-nav fl">
          <ul>
            <li>水果</li>
            <li><a href="/single">苹果</a></li>
            <li><a href="/single">葡萄</a></li>
            <li><a href="/single">香蕉</a></li>
          </ul>
          <ul>
            <li>数据</li>
            <li><a href="#">售后</a></li>
            <li><a href="#">相关下载</a></li>
          </ul>
          <ul>
            <li>资讯</li>
            <li>
              <a
                target="_blank"
                href="https://docs.qq.com/sheet/DZENIbmd0SEd4eU5B?groupUin=JFEZ%252FwS1TtyJRW2fJ%252BecSA%253D%253D&tab=BB08J2"
                >关于分工</a
              >
            </li>
            <li><a href="#">需求分析</a></li>
          </ul>
          <ul>
            <li>关于</li>
            <li><a href="#">我们</a></li>
          </ul>
        </section>
        <section class="tel fr">
          <p>110-120-119</p>
          <span>工作时间：周一至周五9：00-21：00</span>
          <p>
            <a href="#"
              ><img src="../../assets/img/QQ.png" width="32" height="32" /></a
            ><a href="#"
              ><img src="../../assets/img/wx.png" width="32" height="32" /></a
            ><a href="#"
              ><img src="../../assets/img/wb.png" width="32" height="32"
            /></a>
          </p>
        </section>
      </section>
      <section class="clear"></section>
      <section class="copyright">
        <p>版权所有归182&copy;2020-2021</p>
      </section>
    </footer>
  </div>
</template>

<script>
// @ is an alias to /src

export default {
  name: "Home",
  methods: {
    goUser() {
      this.$router.push("/userHome");
    },
    logOut() {
      window.sessionStorage.removeItem("user");
      this.$router.push("/");
    },
  },
};
</script>

<style src="../../assets/css/base.css" scoped></style>
